/**
* @Description: WoShop商城
* @Author: 梧桐
* @Copyright: 武汉一一零七科技有限公司©版权所有
* @Link: www.wo-shop.net
* @Contact: QQ:2487937004
*/
<template>
	<view class="page">
		<view class="mainBody">
			<view class="header u-flex-col">
				<u-image mode='aspectFit' class="u-m-10" :src="imgStaticUrl+'/images/sms.png'" width="200" height="150"></u-image>
				<text class="title">{{$t('请输入验证码')}}</text>
				<view class="sub-title">{{$t('已发送至')}}<text class="phone u-p-l-10"> +86 {{phone}}</text></view>
			</view>

			<u-message-input :focus="true" :breathe="true" :maxlength="maxLength" active-color="#fa3534" font-size="40"
				:bold="false" @finish="finishSmsCode"></u-message-input>

			<view class="u-flex u-row-between u-m-t-30">
				<view @click="getCode">{{tips}}</view>
				<u-verification-code :seconds="seconds" ref="uCode" @change="codeChange" :end-text="$t('获取验证码')">
				</u-verification-code>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgStaticUrl: '',
				tips: '',
				seconds: 60,
				maxLength: 6,
				fontSize: 50,
				AppName: '',
				phone: '',
				password: '',
				smsCode: '', //验证码
				isWechatShow: false,
				devicetoken: '',
				appInfo: {},
				paramData: {},
				register_client:'',//客户端环境
			}
		},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		onReady() {
			this.$refs.uCode.start();
		},
		watch: {
			uForm: {
				handler(val) {
					if (val.phone && val.password) {
						this.isFinishInput = true
					} else {
						this.isFinishInput = false
					}
				},
				deep: true
			}
		},
		onLoad(option) {
			this.imgStaticUrl = this.STATICURL;  // 线上图片地址（兼容微信小程序写法）
			this.paramData = option
			this.phone = option.phone
			this.AppName = this.$AppName
			
			// #ifdef APP-PLUS
			this.getCid();
			switch(uni.getSystemInfoSync().platform){
			    case 'android':
			       this.register_client='app_android'
			       break;
			    case 'ios':
			       this.register_client='app_ios'
			       break;
			}
			// #endif
			// #ifdef H5
				this.register_client = 'H5'
			//#endif
			this.getThirdLogin();
			this.appInfo = uni.getSystemInfoSync();
			
		},

		methods: {

			getCid() {
				//从缓存中取cid值，如果取到就不调取接口获取
				var info = plus.push.getClientInfo();
				var cid = info.clientid;
				var token = info.token;
				if (cid && token) {
					uni.setStorageSync("devicetoken", cid);
					this.devicetoken = uni.getStorageSync("devicetoken");
				}
			},
			// 登录
			finishSmsCode(e) {
				this.smsCode = e;
				uni.removeStorageSync('token');
				this.$http.getSmsLogin({
					phone: this.phone,
					sms_code: this.smsCode,
					type: 2,
					devicetoken: this.devicetoken,
					register_client:this.register_client,
					...this.paramData
				}).then((res) => {
					if (res.status == 200) {
						this.$toast(res.mess)
						uni.setStorageSync('phone', this.phone);
						this.$store.commit('loginStatus', true)
						uni.setStorageSync('token', res.data.token);
						uni.setStorageSync('identity', res.data.identity);
						uni.setStorageSync('role', res.data.role);
						uni.setStorageSync('role_id', res.data.shop_id);
						uni.setStorageSync('pid', res.data.shop_id);
						uni.setStorageSync('serviceShopId', res.data.serviceShopId);

						uni.$emit('accountLogin', {
							isLogin: true
						})
						this.getaddMemberMobile();
						uni.closeSocket({
							success() {
								console.log('socket关闭成功');
							},
							fail(res) {
								console.log(res);
							}
						})
						setTimeout(() => {
							this.im()
							this.$u.route({
								url: "/pages/tabBar/home",
								type: "reLaunch"
							})
						}, 1500);
					}
				})
			},
			// 判断是否开启第三方登录
			getThirdLogin() {
				this.$http.getThirdLogin().then((res) => {
					if (res.status == 200) {
						this.isWechatShow = res.data.open
					}
				})
			},
			getaddMemberMobile() {
				this.$http.getaddMemberMobile({
					brand: this.appInfo.brand,
					model: this.appInfo.model,
					version: this.appInfo.version,
					system: this.appInfo.system,
					platform: this.appInfo.platform,
				}).then((res) => {
					console.log(res);
				})
			},

			// 第三方注册 微信
			wxLogin() {
				uni.login({
					provider: 'weixin',
					success: (res) => {
						console.log('res:wxLogin ', res);
						uni.getUserInfo({
							provider: 'weixin',
							success: (infoRes) => {
								console.log('infoRes:infoResinfoResinfoResinfoResinfoRes ',
									infoRes);
								this.$loading()
								this.$http.thirdLogin({
									oauth: 'weixin',
									openid: infoRes.userInfo.openId,
									nick_name: infoRes.userInfo.nickName,
									iconurl: infoRes.userInfo.avatarUrl,
									uniongender: infoRes.userInfo.gender,
									unionid: infoRes.userInfo.unionId,
									devicetoken: this.devicetoken,
									register_client:this.register_client,
								}).then(result => {
									if (result.status == 200) {

										this.$toast(result.mess)
										uni.setStorageSync('token', result.data.token);
										uni.setStorageSync('identity', result.data
											.identity);
										uni.setStorageSync('role', result.data
											.role); //角色身份
										uni.setStorageSync('role_id', result.data.shop_id);
										uni.setStorageSync('pid', result.data.shop_id);
										uni.setStorageSync('serviceShopId', result.data
											.serviceShopId);
										this.$store.commit('loginStatus', true)
										uni.$emit('accountLogin', {
											isLogin: true
										})
										// this.getaddMemberMobile();
										console.log(result.data)
										setTimeout(() => {
											this.im()
											uni.switchTab({
												url: '/pages/tabBar/home'
											})
										}, 1500);
									} else {
										console.log(JSON.stringify(result))
									}

								}).catch(err => {
									console.log(JSON.stringify(err));

								})

							}
						});

					},
					fail: (err) => {
						console.log('login fail:', err);
					}
				});
			},
			// 获取手机信息

			navigateTo(url, data) {
				this.$navigateTo(url)
			},
			goHome() {
				uni.switchTab({
					url: '/pages/tabBar/home',
				})
			},

			codeChange(text) {
				this.tips = text;
			},
			getCode() {
				if (this.$refs.uCode.canGetCode) {
					// 模拟向后端请求验证码
					uni.showLoading({
						title: this.$t('正在获取验证码')
					})
					this.$http.getSmsCode({
						phone: this.phone,
						type: 2,
					}).then((res) => {
						console.log(res)
						if (res.status == 200) {
							this.$u.toast(this.$t('验证码已发送'));
							// 通知验证码组件内部开始倒计时
							this.$refs.uCode.start();
							uni.hideLoading();
						}else{
							this.$u.toast(this.$t('验证码发送失败'));
							uni.hideLoading();
						}
					})
				}
			},

		}
	}
</script>

<style lang="scss" scoped>
	@import "~uview-ui/index.scss";

	.page {
		background: #ffffff;
		height: 100%;
	}

	.mainBody {
		padding: 100rpx 70rpx;

		.title {
			font-size: 36rpx;
		}

		.sub-title {
			color: #797979;
			font-size: 24rpx;
		}

		.phone {
			color: #000;
		}
	}

	.header {
		align-items: center;
	}

	/deep/uni-view {
		line-height: 2.4;
	}
</style>
